import React, { Component } from 'react'
import { connect } from 'react-redux'
import actions from '@/store/actions/saga'

import css from '@/styles/index.scss'

class Detail extends Component {
    constructor(props) {
        super(props)
    }

    componentDidMount() {
        console.log('无双')
        console.log(this.props)
        this.props.fetchNewsDetail(this.props.match.params.id)
    }

    render() {
        const { isFetching, sagaNewsDetail, history } = this.props
        return (
            <div className={css.saga}>
                {isFetching && <div>加载中…</div>}
            {!isFetching && sagaNewsDetail && (
                    <div>
              <div className={css.back}>
                          <h2>{sagaNewsDetail.title}</h2>
                          <div className={css.title}>
                                <span>{sagaNewsDetail.source}</span>
                                <span>{sagaNewsDetail.ptime}</span>
                  <a onClick={() => history.goBack()}>返回上层</a>
                            </div>
                        </div>

              <div
                            dangerouslySetInnerHTML={{
                                __html: sagaNewsDetail && sagaNewsDetail.content
                            }}/>
            </div>
                )}
          </div>
        )
    }
}
export default connect(state => state.saga, actions)(Detail)
